<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('用户数据权限')" />
</head>
<body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight ibox-content">
        <form class="form-horizontal">
            <h4 class="form-header h4">用户信息</h4>
            <div class="form-group">    
                <label class="col-sm-3 control-label is-required">用户名称：</label>
                <div class="col-sm-8">
                    <input name="userName" class="form-control" type="text" th:value="${user.userName}">
                    <input name="userId" id="userId" class="form-control" type="hidden" th:value="${user.userId}">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">角色：</label>
                <div class="col-sm-8">
                    <select name="roleId" id="roleId" class="form-control">
                        <option th:each="role : ${roles}" th:text="${role.roleName}" th:value="${role.roleId}"></option>
                    </select>
                </div>
            </div>
            <h4 class="form-header h4" id="h4Title">业务需求信息</h4>
            <div class="row">
                <div class="btn-group-sm" id="toolbar" role="group">
                    <a class="btn btn-success" onclick="selectObject()">
                        <i class="fa fa-plus"></i> 添加授权
                    </a>
                    <a class="btn btn-danger multiple disabled" onclick="cancelAll()">
                        <i class="fa fa-remove"></i> 取消授权
                    </a>
                    <a class="btn btn-warning" onclick="closeItem()">
                        <i class="fa fa-reply-all"></i> 关闭
                    </a>
                </div>

                <div class="col-sm-12 select-table table-striped">
                    <table id="bootstrap-table"></table>
                </div>
            </div>
        </form>
    </div>
    <th:block th:include="include :: footer" />
    <script th:inline="javascript">
        var prefix = ctx + "userDataAuth/userDataAuth";
        function queryParams(params) {
            var search = $.table.queryParams(params);
            search.userId = $("#userId").val();
            search.roleId = $("#roleId").val();
            return search;
        }
        $(function() {
            var options = {
                url: prefix + "/dataAuthList?userId="+$("#userId").val(),
                createUrl: prefix + "/add",
                updateUrl: prefix + "/edit/{id}",
                removeUrl: prefix + "/remove",
                exportUrl: prefix + "/export",
                importUrl: prefix + "/importData",
                importTemplateUrl: prefix + "/importTemplate",

                queryParams: queryParams,
                modalName: "关联对象",
                columns: [{
                    checkbox: true
                },
                    {
                        field: 'id',
                        title: 'id',
                        visible: false
                    },
                    {
                        field: 'name',
                        title: '名称',
                        sortable: true
                    },
                    {
                        field: 'description',
                        title: '描述',
                        sortable: true
                    },
                    {
                        title: '操作',
                        align: 'center',
                        formatter: function(value, row, index) {
                            var actions = [];
                            actions.push('<a class="btn btn-danger btn-xs" href="javascript:void(0)" onclick="cancelAuthUser(\'' + row.id + '\')"><i class="fa fa-remove"></i>取消授权</a> ');
                            return actions.join('');
                        }
                    }]
            };
            $.table.init(options);
            var roleId = $('#roleId').val();
            handleTitle(roleId);
            $('#roleId').change(function() {
                handleTitle($(this));
                $("#bootstrap-table").bootstrapTable("refresh");
            });
        });

        function handleTitle(roleId) {
            var title = '';
            if (roleId === 100) {
                title = '业务需求信息';
            } else if (roleId === 101) {
                title = '用况信息';
            } else if (roleId === 102) {
                title = '页面信息';
            } else if (roleId === 103) {
                title = '表信息'
            } else if (roleId === 104) {
                title = '接口信息';
            }
            $("#h4Title").text(title);
        }

        function queryParams(params) {
            var search = $.table.queryParams(params);
            search.roleId = $("#roleId").val();
            return search;
        }

        /* 分配用户-选择用户 */
        function selectObject() {
            var url = prefix + '/selectObject?roleId=' + $("#roleId").val() + "&userId=" + $("#userId").val();
            $.modal.open("选择数据权限", url);
        }

        /* 分配用户-批量取消授权 */
        function cancelAll(id) {
            var rows = $.table.selectFirstColumns();
            if (rows.length == 0) {
                $.modal.alertWarning("请至少选择一条记录");
                return;
            }
            $.modal.confirm("确认要删除选中的" + rows.length + "条数据吗?", function() {
                var data = {"ids": rows.join() };
                $.operate.submit(prefix + "/cancel", "post", "json", data);
            });
        }

        /* 分配用户-取消授权 */
        function cancelAuthUser(id) {
            var rows = [];
            rows.push(id)
            $.modal.confirm("确认要取消该数据权限吗？", function() {
                var data = {"ids": rows.join() };
                $.operate.submit(prefix + "/cancel", "post", "json", data);
            })
        }

    </script>
</body>
</html>